<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">

<head th:include="header">
    <title>日志管理-列表</title>
</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>日志管理</h5>
                    </div>
                    <div class="ibox-content">
                        <div class="row row-lg">
                            <div class="col-sm-12">
                                <div class="row">
                                    <div class="col-lg-10 col-sm-9">
                                        <div class="row">
                                            <div class="col-lg-4 col-sm-12">
                                                <input type="text" class="form-control" id="loginName" name="loginName" placeholder="登录名/用户名" />
                                            </div>
                                            <div class="col-lg-4 col-sm-6">
                                                <input type="text" class="form-control laydate" id="startTime" name="startTime" placeholder="日志开始日期" onclick="laydate({ istime: true, format: 'YYYY-MM-DD hh:mm:ss' })"
                                                />

                                            </div>
                                            <div class="col-lg-4 col-sm-6">
                                                <input type="text" class="form-control laydate" id="endTime" name="endTime" placeholder="日志结束日期" onclick="laydate({ istime: true, format: 'YYYY-MM-DD hh:mm:ss' })"
                                                />
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-2 col-sm-3">
                                        <div class="row">
                                            <div class="col-lg-12 col-sm-12">
                                                <button type="submit" class="btn btn-sm btn-primary" onclick="Log.search()">
                                                    <i class="fa fa-search">搜索</i>
                                                </button>
                                                <button type="submit" class="btn btn-sm btn-primary" onclick=" Log.resetSearch()">
                                                    <i class="fa fa-fa-trash">重置</i>
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="hidden-xs" id="logTableToolbar" Log="group">

                                </div>
                                <table id="logTable" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div th:include="footer"></div>
    <script type="text/javascript" th:inline="javascript">
        /**
        * 日志管理的单例
        */
        var Log = {
            id: "logTable",	//表格id
            seItem: null,		//选中的条目
            table: null,
            layerIndex: -1
        };

        /**
         * 初始化表格的列
         */
        Log.initColumn = function () {
            var columns = [
                { field: 'selectItem', radio: true },
                { title: 'id', field: 'id', visible: false, align: 'center', valign: 'middle' },
                { title: '登录名', field: 'loginName', align: 'center', valign: 'middle', sortable: true },
                { title: '角色名', field: 'roleName', align: 'center', valign: 'middle', sortable: true },
                { title: '类名', field: 'className', align: 'center', valign: 'middle', sortable: true },
                { title: '方法名', field: 'method', align: 'center', valign: 'middle', sortable: true },
                { title: '参数', field: 'params', align: 'center', valign: 'middle', sortable: true },
                { title: '执行时间', field: 'time', align: 'center', valign: 'middle', sortable: true },
                { title: '客户端IP', field: 'clientIp', align: 'center', valign: 'middle', sortable: true },
                {
                    title: '创建时间', field: 'createTime', align: 'center', valign: 'middle', sortable: true
                }]
            return columns;
        };


        /**
         * 检查是否选中
         */
        Log.check = function () {
            var selected = $('#' + this.id).bootstrapTable('getSelections');
            if (selected.length == 0) {
                zx.info("请先选中表格中的某一记录！");
                return false;
            } else {
                Log.seItem = selected[0];
                return true;
            }
        };

        /**
         * 重置
         */
         Log.resetSearch = function () {
            $("#loginName").val("");
            $("#startTime").val("");
            $("#endTime").val("");

            MgrUser.search();
        }

        /**
         * 搜索
         */
        Log.search = function () {
            var queryData = {};
            queryData['loginName'] = $("#loginName").val();
            queryData['startTime'] = $("#startTime").val();
            queryData['endTime'] = $("#endTime").val();
            Log.table.refresh({ query: queryData });
        }

        $(function () {
            var defaultColunms = Log.initColumn();
            var table = new BSTable(Log.id, basePath + "sysLog/dataGrid", defaultColunms);
            table.setPaginationType("server");
            table.init();
            Log.table = table;
        });
    </script>
</body>

</html>